<@main.page title="文件审批-详细">
<style>
    .temp-list li {
        list-style: none;
    }

    .temp-list h4, .temp-list h5 {
        color: red;
    }
</style>
<form>
    <div class="row">
        <div class="col-md-12">
            <div class="row">
                <div class="col-md-9">
                    <div style="border:4px solid #f5f5f5">
                        <div style="margin-top:100px; margin-bottom:70px">
                            <h1 style="text-align:center; color:#F00; letter-spacing:4px; font-size:38px">
                                <strong>
                                    青岛董家口经济区管委安监中心文件
                                </strong>
                            </h1>
                            <hr style="border-color:#F00; margin-left:80px; margin-right:80px; margin-top:50px">
                        </div>
                        <h2 style="text-align:center; font-weight:bold; color:#000">关于柴油罐整改报告的回复函</h2>

                        <div style=" margin-left:100px; margin-top:50px; margin-right:40px; font-size:18px; letter-spacing:2px">
                            <p>澳斯顿新材料（青岛）有限公司：</p>

                            <p style=" text-indent:2em">贵公司关于柴油罐整改报告收悉，经研究，现答复如下：</p>

                            <p style=" text-indent:2em">一、建设新的柴油罐应当设定具体时间安排。</p>

                            <p style=" text-indent:2em">二、在新的柴油罐未建成前，
                                对在用柴油罐采取必要的安全保护措施，确保其安全运行。</p>

                            <p style=" text-indent:2em">请企业认真执行，及时反馈整改结果。</p>
                        </div>
                        <div style="margin-right:100px; margin-top:50px;
                                             margin-bottom:100px; font-size:18px; letter-spacing:2px; text-align:right">
                            <p style="text-indent:2em">安监中心</p>

                            <p>2015年11月6日</p>
                        </div>
                    </div>

                </div>
                <div class="col-md-3">
                    <div class="row">
                        <div class="col-md-12">
                            <h4><strong>审批操作</strong></h4>
                            <hr>
                            <div class="form-group">
                                <label class=" control-label">起草人：万里</label><br>
                                <label class=" control-label">起草时间：2015-11-6 15:36</label><br>
                                <label class="control-label">发送给：</label>
                                <ul class="list-inline sidebar-tags">
                                    <li>
                                        <a style="background-color:#78cff8" href="javascript:;">
                                            <i class="fa fa-users"></i>澳斯顿新材料（青岛）有限公司
                                        </a>
                                    </li>
                                    <li>
                                        <a style="background-color:#78cff8" href="javascript:;">
                                            <i class="fa fa-user"></i>张三
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div class="form-group">
                                <label class="control-label">审批</label>

                                <div class="radio-list" style="margin-left: 20px;">
                                    <label class="radio-inline">
                                        <input type="radio" name="NeedApprover" value="Y" checked>需要
                                    </label>
                                    <label class="radio-inline">
                                        <input type="radio" name="NeedApprover" value="N">不需要
                                    </label>
                                </div>
                            </div>
                            <div class="form-group" id="wrap-approveSelect">
                                <label class="control-label">审批人</label>
                                <select id="select-approve" name="Approver" class="form-control select2" multiple
                                        placeholder="">
                                    <option value="">张三</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label class="control-label">审批意见</label>
                                <textarea row="3" class="form-control">
                                </textarea>
                            </div>
                            <div class="form-group">
                                <a href="#responsive" class="btn green" data-toggle="modal"
                                   style=" padding-left:20px; padding-right:25px; margin-right:20px">
                                    同意</a>
                                <button class="btn btn-default " style=" padding-left:20px; padding-right:25px">
                                    返回
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

<script type="text/javascript">
    var editor = null;
    $(document).ready(function () {
        initSendTo();
        initTemp();
    });
    function initSendTo() {
        $('#select2_sample_modal_2').select2();
        $('#select-approve').select2();

        $('input[name=NeedApprover]').on('change', function () {
            if (this.value == 'Y') {
                $('#wrap-approveSelect').show();
            } else {
                $('#wrap-approveSelect').hide();
            }
        });
        CKEDITOR.config.removePlugins = 'elementspath';
        editor = CKEDITOR.replace('editor1');
    }
    function initTemp() {
        $('.temp-list li').hide();
        $('.temp-list .active').show();

        $('#temp-pre').on('click', function () {
            var currentLi = $('.temp-list').find('.active')
            if (currentLi.prev('li').length == 0) {
                return;
            }
            $('.temp-list li').hide();
            currentLi.removeClass('active');
            currentLi.prev('li').show().addClass('active');
        });
        $('#temp-next').on('click', function () {
            var currentLi = $('.temp-list').find('.active');
            if (currentLi.next('li').length == 0) {
                return;
            }
            $('.temp-list li').hide();
            currentLi.removeClass('active');
            currentLi.next('li').show().addClass('active');
        });
        $('.temp-selected').on('click', function () {

        });
    }

</script>

</@main.page>